<template>
  <mu-dialog transition="slide-right" fullscreen :open.sync="openFullscreen">
    <div class="p-box">
      <div class="p-header">
        <mu-appbar color="primary" class="lan-header">
          <mu-button icon slot="left" @click="close">
            <i class="iconfont angle-left iconangle-left"></i>
            <span class="lan-header-back">返回</span>
          </mu-button>平面图标点
        </mu-appbar>
      </div>
      <div class="p-content" style="padding:0 0.14rem">
        <MapShow
          :type="type"
          :needNewColor="type=='edit'?true:false"
          :width="'100%'"
          :url="images"
          v-model="points"
          @change="pointsTotalChange"
          :enableClick="true"
          :readonly="false"
        ></MapShow>
      </div>
      <div class="p-footer">
        <mu-button
          full-width
          color="primary"
          @click="confirm"
          :disabled="existPointsTotal+points.length>60"
        >确认</mu-button>
      </div>
    </div>
  </mu-dialog>
</template>
<script>
export default {
  name: "dialogMarkPoint",
  components: {},
  props: {
    type: {
      type: String,
      default: "add"
    }
  },
  data() {
    return {
      openFullscreen: false,
      images: require("./a.png"),
      points: [],
      existPointsTotal: 0
    };
  },
  computed: {},
  created() {},
  mounted() {},
  watch: {},
  methods: {
    init(data) {
      let datileL = data.measurePointVoList || [];
      this.existPointsTotal = Number(data.existPointsTotal);
      if (datileL.length) {
        var arr = [];
        for(let i=0;i<datileL.length;i++){
        // data.points.forEach(el => {
          var point = datileL[i]['coord']?datileL[i]['coord'].split(","):[datileL[i]['left'],datileL[i]['top']];
          arr.push({
            old: true,
            left: point[0],
            top: point[1],
            lng: point[0],
            lat: point[1],
            canDelete:datileL[i]['canDelete']
          });
        // });
        }
        this.points = arr;
      } else {
        this.points = [];
      }

      this.images = data.url;
      this.openFullscreen = true;
    },
    close() {
      this.openFullscreen = false;
    },
    clear() {
      this.form = {
        startTime: "",
        endTime: ""
      };
    },
    pointsTotalChange(data) {
      if (this.existPointsTotal + data.length > 60) {
        this.$A.MS("已有点位与新增点位不能超过60个");
      }
    },
    //点击确定
    confirm() {
      if (this.points.length) {
        this.$emit("getPoints", this.points);

        this.openFullscreen = false;
      } else {
        this.$A.MS("请选择点位");
      }
    }
  },
  destroyed() {}
};
</script>
<style lang="less">
</style>
